<%@ page import="com.entity.Doctor" %><%--
  Created by IntelliJ IDEA.
  User: HP
  Date: 2021/9/19
  Time: 14:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>医生主页</title>
    <link href="css/libiao.css" type="text/css" rel="stylesheet">
</head>
<body>
<br>
<br>
<%
    Doctor doctor = (Doctor) request.getAttribute("doctorInfo");
%>
<h2 style="margin-left: 15%">医生:<%=doctor.getName()%> 工号:<%=doctor.getWorkId()%>，欢迎您</h2>
<br>

<hr align=center width="70%" SIZE=3>
<br>

<section class="main_box">
    <div class="box" id="app">
        <ul>
            <li :class="li.class" v-for="li in data">
                <a :href="li.href" target="_self">
                    <h3>{{li.name}}</h3>
                    <p>{{li.text}}</p>
                    <img :src="li.src" alt="img">
                </a>
            </li>
            <div style="clear: both"></div>
        </ul>
    </div>
</section>
<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
<script>
    new Vue({
        el: "#app",
        data: function () {
            return {
                data:[
                    {class:"box_ul_li",href:"doctorServlet?skip=noDeal",src:"images/1.jpeg",name:"挂号名单",text:"未处理挂号名单"},
                    {class:"box_ul_li",href:"doctorServlet?skip=yesDeal",src:"images/2.jpeg",name:"挂号名单",text:"已处理挂号名单"},
                    {class:"box_ul_li on",href:"doctorServlet?skip=alDrag",src:"images/3.jpeg",name:"药品",text:"查看已开药品单"},
                    {class:"box_ul_li",href:"doctorServlet?skip=alDeal",src:"images/4.jpeg",name:"诊断",text:"查看已开诊断单"},
                    {class:"box_ul_li",href:"login.jsp",src:"images/5.jpeg",name:"返回",text:"返回登录页面"},
                ]
            }
        }
    })
    $(".box ul li").hover(function(){
        $(this).addClass('on').siblings().removeClass('on');
    });
</script>
</body>
</html>
